{% extends 'base.html' %}
{% block link %}
<link rel="stylesheet" href="/static/dist/datatables/dataTables.bootstrap.css">
{% endblock %}

{% block body %}
    <section class="content">
      <div class="row">
        <div class="col-xs-12">
          <div class="box">
            <div class="box-header">
              <h3 class="box-title">端口信息编辑</h3>
            </div>
            <!-- /.box-header -->
            <div class="box-body">
              <table id="example2" class="table table-bordered table-hover">
                <thead>
                <tr>
                  <th>资源码(请忽略)</th>
                  <th>资源名称</th>
                </tr>
                </thead>
                <tbody>
                </tbody>
                <tfoot>
                </tfoot>
              </table>
            </div>
            <!-- /.box-body -->
          </div>
          <!-- /.box -->


          <!-- /.box -->
        </div>
        <!-- /.col -->
      </div>
      <!-- /.row -->
    </section>
{% endblock %}
{% block javascript %}
<script src="/static/dist/datatables/jquery.dataTables.min.js"></script>
    <script src="/static/dist/datatables/dataTables.bootstrap.min.js"></script>
    <script>
    $(document).ready(function() {
    $('#example2').DataTable( {
        "ajax": "{% url 'get_list' %}",
        "paging": true,
        "ordering": true,
        "info": true,
        "autoWidth": false,
        "scrollX": true,
        "pagingType": "full_numbers",
        "stateSave": true,
        "columns": [

            { "data": "graphid" ,"sClass": "text-center"},
            { "data": "name" ,"sClass": "text-center"},
        ],
        "columnDefs": [
        {
          targets: 0 ,//targets last column, use 0 for first column
          className: 'btn-link pointer',
         "data": "download_link",
            "sClass": "text-center",
         "render": function ( data, type, full, meta ) {
          return '<a class="btn-link" href="'+'{% url 'editdev' %}?id='+data+'" target="_blank">'+ data +'</a>';
          }
        }
      ]
    } );
} );
</script>
    <script type="text/javascript">
			$(document).ready(function(){
				$('#edit').addClass("active");
		});
    </script>
{% endblock %}